<!--
    
/* ****************************************************************************
 *
 * Copyright (c) Microsoft Corporation. 
 *
 * This source code is subject to terms and conditions of the Microsoft Public License. A
 * copy of the license can be found at http://go.microsoft.com/fwlink/?LinkID=131993. If
 * you cannot locate the Microsoft Public License, please send an email to
 * mixon@microsoft.com. By using this source code in any fashion, you are agreeing to
 * be bound by the terms of the Microsoft Public License.
 *
 * You must not remove this notice, or any other, from this software.
 *
 *
 * ***************************************************************************/
    
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=8" />
    <title>MIX Online - Descry: The Obesity Epidemic Visualization</title>
    <link rel="icon" href="/favicon.gif" type="image/gif" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="language" content="en" />
    <meta name="description" content="MIX Online is a community for web designers and developers who build and believe in the innovative web. We also have a sister conference called MIX. Simply, this is who we are. " />
    <meta name="keywords" content="MIX Online, microsoft, ie, internet explorer, microformats, data visualization, inforgraphic, oomph, oxite, descry, user experience, c#, programming, MIX, MIX conference, design, designer, web design, web designer, css, html, xhtml, css, javascript, ajax, silverlight, wpf, flash, web standards, visualization, obesity, CDC" />
    <link href="css/yui.reset-base.2.6.0.css" rel="stylesheet" type="text/css" />
    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <script src="getsilverlight.js" language="javascript" type="text/javascript"></script>
</head>
<body>
    <div id="upsell"> <a href="http://www.visitmix.com/lab/descry"><span>Like what you see? Check out other visualizations by the MIX Online team »</span></a> </div>
    <div id="container">
      <div id="title">
        <h1><span class="the">THE</span><span class="obesity">OBESITY</span><span class="epidemic">EPIDEMIC</span></h1>
        <p>"During the past 20 years there has been a dramatic increase in obesity in the United States. In 2007, only one state (Colorado) had a prevalence of obesity less than 20%. Thirty states had a prevalence equal to or greater than 25%; three of these states (Alabama, Mississippi and Tennessee) had a prevalence of obesity equal to or greater than 30%"
          - <a href="http://www.cdc.gov/nccdphp/dnpa/obesity/trend/maps/index.htm">US Obesity Trends 1985-2007, Center for Disease Control &amp; Prevention Web Site</a></p>
      </div>
      <p class="intro"><strong>Explore</strong> the obesity trends in the United States by interacting with the visualization below. Each tee in the matrix represents the percentage of population in the particular state that is obese<a class="tt" href="#">*<span class="tooltip"><span class="content">Per CDC, obesity is indicated by BMI &gt;= 30</span></span></a>. The darker the red and the larger the tee, the more obese a state in that particular year.</p>
      <div id="visualization">
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
          <param name="source" value="ClientBin/Obesity.xap"/>
          <param name="onerror" value="onSilverlightError" />
          <param name="background" value="white" />
          <param name="minRuntimeVersion" value="2.0.31005.0" />
          <param name="autoUpgrade" value="true" />
        </object>
      </div>
      <div id="getsilverlight" style="display:none">Uh oh, there's a problem. You need Silverlight to experience the goodness of this infographic. It'll only take a few seconds. Do it. <a href="getsilverlight.aspx">Click here to install Silverlight</a>
      </div>
      <h1 id="year"></h1>
      <ul id="legend">
        <li class="legend">Legend: </li>
        <li class="obese">Obese</li>
        <li class="overweight">Overweight</li>
        <li class="normal">Normal</li>
      </ul>
      <div id="bar-chart"></div>
      <p id="footer">This infographic was created by the <a href="http://www.visitmix.com/">MIX Online</a> crew in the spirit of shedding some light on the ongoing obesity epidemic in the United States of America. The data used in this infographic is made available through <a href="http://apps.nccd.cdc.gov/brfss">CDC's Behavioral Risk Factor Surveillance System (BRFSS)</a>. To learn more about how this visualization was created and explore other visualizations, visit the <a href="http://www.visitmix.com/lab/descry/">MIX Online: Project Descry</a> site. Thanks for dropping by and try not to put off that New Year's resolution anymore. :)</p>    	
    </div>    
</body>
</html>
